<template>
  <div id="app">
      <!-- <router-link to="/home" tag="button" replace>Home</router-link> 
      <router-link to="/about" tag="button" replace>About</router-link> -->
      <!-- <button @click="btn1">首页</button>
      <button @click="btn2">页面</button> -->
      <router-link to="/home">首页</router-link>
      <router-link to="/about">关于</router-link>
      <router-link :to="'/user/' + userId" >我的</router-link>
      <!-- <router-link to="/profile">档案</router-link>
       -->
      <!-- <router-link :to="{path:'/profile',query:{name:'why',height:'1.88'}}">档案</router-link> -->
      <button @click="btn4">用户</button>
      <button @click="btn3">档案</button>

    <router-view/>
  </div>
</template>
<script>
export default {
  name:'App',
  data(){
    return{
      userId:'lisi'
    }
  },
  methods:{
    btn1(){
      this.$router.push('/home')
    },
    btn2(){
      this.$router.push('/about')
      // this.$router.replace('/about')

    },
    btn4(){

      this.$router.push('/user/'+this.userId)
    },
    btn3(){
      this.$router.push({
        path:'/profile',
        query:{
          name:'nm',
          age: 18 ,
          height: 1.22
        }
      })
    }
  }
}
</script>
<style>

</style>
